// 权限控制
// 根据需求(检测url发生变化) 挑选 技术点 路由守卫
import router from '@/router'
import store from '@/store'
// 引入进度条
import nprogress from 'nprogress'
// 引入进度条样式
import 'nprogress/nprogress.css'
const whiteList = ['/login', '/404'] // 定义白名单
// 前置守卫
router.beforeEach(async(to, from, next) => {
  // 开启进度条
  nprogress.start()
  // 判断又有无token
  if (store.getters.token) {
    // 有token判断是不是去登录页
    if (to.path === '/login') {
      // 如果是去登录页跳转到首页
      next('/')
    } else {
      // 有token，并且没有接受过后台返回的userInfo
      if (!store.getters.userId) {
        // 获取用户信息
        // async函数所return的内容 用await就可以接收到
        const { roles } = await store.dispatch('user/getUserInfo')
        // 已经拿到了用户的权限点(页面访问权menus),进行路由的筛选(准备一个筛选路由的方法)
        const newRoutes = await store.dispatch('permission/filterRoutes', roles.menus)
        // newRoutes就是筛选得到的动态路由
        // 动态路由需要添加到路由表中 默认的路由表只有静态路由，没有动态路由
        router.addRoutes([...newRoutes, { path: '*', redirect: '/404', hidden: true }])
        // 路由对象可以访问自己的hash值，当addRoutes的时候，路由对象重新创建了新的hash值
        // 因为原来的hash值变了，所以只能重新跳转原来的路径，不能继续访问原来的hash值
        // 重新跳转原来的
        next(to.path)
      } else {
        // await后面的代码都是异步的
        // 不是直接放行
        next()
      }
    }
  } else {
    // 没有token判断是不是白名单
    //   if (whiteList.indexOf(to.path) > -1) {
    if (whiteList.includes(to.path)) {
      // 要去的在白名单直接放行
      next()
    } else {
      // 不在白名单的跳转到登录页
      next('/login')
    }
  }
  // 解决手动切换地址时进度条不关闭的问题
  nprogress.done()
})
// 后置守卫
router.afterEach(() => {
  // 关闭进度条
  nprogress.done()
})
